<template>
	<view>
		<view class="listItem"
			v-for="(item,index) in recList"
			:key="index"
			@tap="goRecDet(item)"
		>
			<view class="currsta" :class="classes(item)"></view>
			<view class="loreTit ellip">{{item.loreName}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			recList:Array
		},
		computed:{
			classes(){
				return function(item){
					return{
						'comp' : item.isFinish == 2,
						'noComp' : item.isFinish == 1
					}
				}
			}
		},
		methods:{
			goRecDet(item){
				this.$emit('goRecDet',item);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.listItem{
		display: flex;
		align-items: center;
		@include respTo(phone){
			height: 90rpx;
			line-height: 90rpx;
			font-size: $font-size30;
		}
		@include respTo(pad){
			height: $pss-height60;
			font-size: $padSize16;
		}
		color: $pss-text-color3;
		border-bottom: 1rpx solid #f0f0f0;
		.currsta{
			border-radius: 50%;
			margin-right: 10rpx;
			opacity: .8;
			@include respTo(phone){
				width: 20rpx;
				height: 20rpx;
			}
			@include respTo(pad){
				width: 14rpx;
				height: 14rpx;
			}
			&.comp{
				background: $pss-color-green;
			}
			&.noComp{
				background:$pss-color-red;
			}
		}
	}
</style>